﻿@model GPS.ENTITYS.CrudModelPhanCongLichHoc

@{
    ViewBag.Title = "Phân công giảng viên, phương tiện, học viên theo từng khóa học";
}





<style>
    div#tree ul li {
        margin-left: 5px;
        position: relative;
        padding-left: 5px;
        padding-bottom: 10px;
        padding-top: 10px;
    }

        div#tree ul li::before {
            content: " ";
            position: absolute;
            width: 1px;
            background-color: #ccc;
            top: 5px;
            bottom: -12px;
            left: -10px;
        }



        div#tree ul li:last-child::before {
            display: none;
        }

        div#tree ul li::after {
            content: " ";
            position: absolute;
            left: -10px;
            width: 10px;
            height: 1px;
            background-color: #ccc;
            top: 12px;
        }


    /*Menu*/
    .menuphuongtien {
        position: absolute;
        z-index: 1000;
        display: none;
        border: 1px solid black;
        border-radius: 3px;
        width: 200px;
        background: #000;
        box-shadow: 10px 10px 5px #888888;
    }

        .menuphuongtien ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

            .menuphuongtien ul a {
                text-decoration: none;
            }

            .menuphuongtien ul li {
                padding: 5px 2px;
                margin-bottom: 3px;
                color: white;
                font-weight: bold;
                background-color: darkturquoise;
            }

                .menuphuongtien ul li:hover {
                    cursor: pointer;
                    background-color: #7fffd4;
                }

    /*menugiangvien*/
    .menugiangvien {
        position: absolute;
        z-index: 1000;
        display: none;
        border: 1px solid black;
        border-radius: 3px;
        width: 200px;
        background: #000;
        box-shadow: 10px 10px 5px #888888;
    }

        .menugiangvien ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

            .menugiangvien ul a {
                text-decoration: none;
            }

            .menugiangvien ul li {
                padding: 5px 2px;
                margin-bottom: 3px;
                color: white;
                font-weight: bold;
                background-color: darkturquoise;
            }

                .menugiangvien ul li:hover {
                    cursor: pointer;
                    background-color: #7fffd4;
                }


    /* Colors */
    .Gainsboro, .Orange, .Plum {
        width: 15px;
        height: 15px;
        border: 0px solid black;
        display: inline-block;
        margin-right: 5px;
    }

    .Gainsboro {
        background-color: Gainsboro;
    }

    .Orange {
        background-color: red;
    }

    .Plum {
        background-color: Plum;
    }
</style>

<style type="text/css">
    .footer-distributed {
        position: inherit;
    }

    .table > tbody > tr > td {
        border: 1px solid #eceeef !important;
        overflow: hidden;
    }

    /*option:nth-child(1), option:nth-child(4) {
        font-weight: bold;
    }*/

    option {
        font-weight: bold;
    }

    #lstBoxGiangVien option {
        padding-bottom: 10px;
    }

    #lstBoxHocVien option {
        padding-bottom: 10px;
    }
</style>





<div id="wait" style="display: none; position:absolute; top: 10%; right: 10%; padding: 2px; z-index: 99999">
    <img src="~/fonts/images/loading16.gif" width="65" height="65" />
</div>

<div class="menuphuongtien">
    <ul>
        <li><span class='Gainsboro'></span>&nbsp;<a href="javascript:void()" id="btnthemgiangvien">Thêm giảng viên </a></li>
        <li><span class='Gainsboro'></span>&nbsp;<a href="javascript:void()" id="btnthemhocvien">Thêm học viên </a></li>
        <li><span class='Orange'></span>&nbsp;<a href="javascript:void()" id="btnxoaphuongtien">Xóa phương tiện</a></li>
        <li id="btndonglaiphuongtien"><span class='Orange'></span>&nbsp;<a href="javascript:void()">Đóng lại</a></li>

        <li style="display:none">
            <input type="text" id="txtID_PT" />
        </li>
    </ul>
</div>

<div class="menugiangvien">

    <ul>
        @*<li><span class='Gainsboro btnthemhocvien'></span>&nbsp;<a href="javascript:void()" id="btnthemhocvien">Thêm học viên </a></li>*@
        <li><span class='Orange btnxoagiangvien'></span>&nbsp;<a href="javascript:void()" id="btnxoagiangvien">Xóa giảng viên</a></li>
        <li id="btndonglaigiangvien"><span class='Orange'></span>&nbsp;<a href="javascript:void()">Đóng lại</a></li>
        <li style="display:none">
            <input type="text" id="txtID_GV" />
        </li>
    </ul>
</div>

@*Dialog*@

<div class="modal fade" id="myModalPhuongTien" role="dialog" style="z-index:2000">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title" style="font-weight:bold">Danh sách phương tiện thuộc cơ sở đào tạo</h4>
            </div>
            <div class="modal-body">

                <input type="text" class="form-control" placeholder="Tìm theo biển số" id="txtSearchPhuongTien" />
                <br />
                <select multiple="multiple" id='lstBoxPhuongTien' class="form-control" style="width: 100%; max-width: none; height: 50%; font-weight: bold">
                  
                </select>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" id="btnSavePhuongTien">Cập nhật</button>
                <button type="button" class="btn btn-danger" id="btnHuyBoPhuongTien">Hủy bỏ</button>

            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="myModalGiangVien" role="dialog" style="z-index:2000">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title" style="font-weight:bold">Danh sách giảng viên thuộc cơ sở đào tạo</h4>
            </div>
            <div class="modal-body">

                <input type="text" class="form-control" placeholder="Tìm họ tên hoặc mã giảng viên" id="txtSearchGiangVien" />
                <br />
                <select multiple="multiple" id='lstBoxGiangVien' class="form-control" style="width: 100%; max-width: none; height: 50%; font-weight: bold; padding-bottom:5px">
                
                </select>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" id="btnSaveGiangVien">Cập nhật</button>
                <button type="button" class="btn btn-danger" id="btnHuyBoGiangVien">Hủy bỏ</button>

            </div>
        </div>
    </div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel" id="myModalHocvien" style="z-index:2000; ">
    <div class="modal-dialog" role="document" style="width: 1000px;">
        <div class="modal-content">
            <div class="modal-header">
                @*<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>*@
                <h4 class="modal-title" id="gridSystemModalLabel" style="font-weight:bold">Danh sách học viên thuộc khóa học</h4>
            </div>
            <div class="modal-body">
                <input type="text" class="form-control" placeholder="Tìm họ tên hoặc mã học viên" id="txtSearchHocVien" />
                <br />
                <select multiple="multiple" id='lstBoxHocVien' class="form-control" style="width: 100%; max-width: none; height: 50%; font-weight: bold; padding-bottom:5px">
                  
                </select>
                
            </div>
            <div class="modal-footer">

                <button type="button" class="btn btn-primary" id="btnSaveHocVien">Cập nhật</button>
                <button type="button" class="btn btn-danger" id="btnHuyBoHocVien">Hủy bỏ</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!--Phương tiện AUTO-->
<div class="modal fade" id="myModalPhuongTienAuto" role="dialog" style="z-index:2000">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title" style="font-weight:bold">Danh sách phương tiện có số tự động thuộc cơ sở đào tạo</h4>
            </div>
            <div class="modal-body">

                <input type="text" class="form-control" placeholder="Tìm theo biển số" id="txtSearchPhuongTienAuTo" />
                <br />
                <select multiple="multiple" id='lstBoxPhuongTienAuTo' class="form-control" style="width: 100%; max-width: none; height: 40%; font-weight: bold"></select>
                <br />
                <input type="number" class="form-control" placeholder="Số lượng học viên trên xe" id="txtKH_PT_AUTO_SOHV" />
                <br />
                @*<input class="form-control" placeholder="Mô tả" id="txtKH_PT_AUTO_MOTA"  style="width:80%" />*@
                <textarea class="form-group" placeholder="Mô tả" rows="5" style="width:100%" id="txtKH_PT_AUTO_MOTA"></textarea>
                <br />
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" id="btnSavePhuongTienAuTo">Cập nhật</button>
                <button type="button" class="btn btn-danger" id="btnHuyBoPhuongTienAuTo">Hủy bỏ</button>

            </div>
        </div>
    </div>
</div>


@using (Html.BeginForm("Create", "GPS_PhanCongLichHoc", FormMethod.Post, new { @id = "myForm" }))
{
    @Html.AntiForgeryToken()

    @Html.ValidationSummary(true)
    @Html.Hidden("DVGTVT_MA", (string)ViewBag.Ma_DVGT, new { @id = "DVGTVT_MA" })
    
    <br />
    <br />
    <h3 class="text-center fdb-title-search-form">Phân công giảng viên, phương tiện, học viên theo từng khóa học</h3>
    <br />
     
    
    <h4 class="text-center fdb-title-search-form" style="color:blue">@ViewBag.DVGTVT_MAs</h4>
    @Html.Hidden("IsEdit", 0)
    <div class="container">


        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="#home">Sắp xếp giảng viên vào khóa học</a></li>
            <li><a data-toggle="tab" href="#menu1">Thông tin phân công giảng viên - phương tiện - học viên </a></li>
            <li><a data-toggle="tab" href="#menu2">Thông tin phân công phương tiện số tự động</a></li>

        </ul>

        <div class="tab-content" style="z-index:1000">

            <div id="home" class="tab-pane fade in active">
                @*<h3>Giảng viên khóa học</h3>*@
                <br />
                <div id="tabs-1">

                    <fieldset class="fs_body">
                        <legend class="head_title">Sắp xếp giảng viên vào khóa học</legend>

                        <div class="w3-row w3-border">
                            <div class="row margin-top-05">

                                <div style="width:100%">


                                </div>


                                <div style="width:100%; margin-top:10px; margin-bottom:10px">

                                    <div style="margin-left:10px">
                                        @Html.DropDownList("ddlKH_MA_1", (SelectList)ViewBag.KH_MAs,string.Empty, new { @title = "Vui lòng chọn khóa học...", @id = "ddlKH_MA_1", @style = "font-weight:bold;width:300px" })


                                    </div>
                                    <br />

                                </div>
                            </div>
                            <div class="w3-col" style="width:45%">

                                <div class="subject-info-box-1" style="padding:5px">
                                    <br />
                                    <label style="color:blue; font-size:12px">
                                        Danh sách giảng viên thuộc CSĐT
                                    </label>
                                    <br />
                                    <input type="text" class="form-control" placeholder="Tìm họ tên hoặc số CMND" id="txtSearchGV_NOTIN_KH" />
                                    <br />
                                    <select multiple="multiple" id='lstBoxGV_NOTIN_KH' class="form-control" style="width:100%; max-width:none; height:50%">
                                       
                                    </select>
                                </div>

                            </div>
                            <div class="w3-col" style="width:10%">
                                <div class="subject-info-arrows text-center" style="vertical-align:middle">
                                    <br />
                                    <br />
                                    <br />
                                    <br />
                                    <br />
                                    <br />

                                    <br />

                                    <input type="button" id="btnRight" value=">" class="btn btn-default" /><br />
                                    <input type="button" id="btnLeft" value="<" class="btn btn-default" /><br />
                                
                                </div>
                            </div>
                            <div class="w3-col" style="width:45%">
                                <div class="subject-info-box-2" style="padding:5px">
                                    <br />
                                    <label style="color:blue; font-size:12px">
                                        Danh sách giảng viên thuộc khóa học:
                                    </label>
                                    <strong id="strongKH_1" style="color: #F91313"></strong>
                                    <br />
                                    <input type="text" class="form-control" placeholder="Tìm họ tên hoặc số CMND" id="txtSearchGV_IN_KH" />
                                    <br />
                                    <select multiple="multiple" id='lstBoxGV_IN_KH' class="form-control" style="width:100%; max-width:none; height:50%">
                                     
                                    </select>
                                </div>
                            </div>
                        </div>
                    </fieldset>


                </div>
            </div>

            <div id="menu1" class="tab-pane fade">
                <br />

                <div id="tabs-2">

                    <div class="w3-row w3-border">
                        <div class="w3-col" style="width: 30%; border-right: 1px solid #ccc !important">
                            <div class="row margin-top-05">

                                <div style="width:100%">

                                </div>


                                <div style="width:100%; margin-top:10px; margin-bottom:10px">

                                    <div style="margin-left:10px">
                                        @Html.DropDownList("ddlKH_MA", (SelectList)ViewBag.KH_MAs, string.Empty, new { @title = "Vui lòng chọn khóa học...", @id = "ddlKH_MA", @style = "font-weight:bold;width:300px" })


                                    </div>
                                    <br />
                                    <button type="button" class="btn btn-primary btn-sm" style="margin-left:10px" id="btnAddPhuongTien" title="Thêm phương tiện vào khóa học" value="1">Thêm phương tiện</button>
                                </div>
                            </div>

                            <br />

                            <div id="tree">
                                <ul style="list-style:none" id="navPhuongTien">
                                   

                                </ul>
                            </div>

                        </div>
                        <div class="w3-col" style="width:70%">

                            <div style="width: 100%; height:150px; border-bottom: 1px solid #ccc !important">
                                <fieldset class="fs_body" style="height:100%">
                                    <legend class="head_title">Thông tin chung khóa học</legend>

                                    <input type="text" style="display:none" id="txtKH_SOLUONGHOVIEN_1_PT" />
                                    <div class="criteria_search">
                                        <div class="row margin-top-05">
                                            <div class="col-md-2 control-label">
                                                Đơn vị đào tạo
                                            </div>
                                            <div class="col-md-5">
                                                <label id="lblKH_DVGTVT" style="color: #F91313; font-weight:bold">@ViewBag.DVGTVT_MAs</label>
                                            </div>
                                            <div class="col-md-2 control-label">
                                                Khóa đào tạo
                                            </div>
                                            <div class="col-md-3">
                                                <label id="lblKH_MA"></label> - <label id="lblKH_TEN"></label>
                                            </div>
                                        </div>
                                        <div class="row margin-top-05">
                                            <div class="col-md-2 control-label">
                                                Hạng đào tạo
                                            </div>
                                            <div class="col-md-4">
                                                <label id="lblKH_HANGDT"></label>
                                            </div>
                                            <div class="col-md-2 control-label">
                                                Hạng GPLX
                                            </div>
                                            <div class="col-md-4">
                                                <label id="lblKH_HANGGPLX"></label>
                                            </div>
                                        </div>
                                        <div class="row margin-top-05">
                                            <div class="col-md-2 control-label">
                                                Ngày KG
                                            </div>
                                            <div class="col-md-4">
                                                <label id="lblKH_NGAY_KG"></label>
                                            </div>
                                            <div class="col-md-2 control-label">
                                                Ngày BG
                                            </div>
                                            <div class="col-md-4">
                                                <label id="lblKH_NGAY_KT"></label>
                                            </div>
                                        </div>
                                    </div>
                                </fieldset>
                            </div>
                            <div style="width: 100%; height:auto; ">
                                <fieldset class="fs_body" style="height:100%">
                                    <legend class="head_title">Danh sách học viên thuộc phương tiện : <strong style="color:blue" id="strongPT_MA"></strong></legend>
                                    <table class="table table-bordered table-striped" style="margin-top:10px" id="tblhocvien">
                                        <thead>
                                            <tr>
                                                <th style="width:50px; text-align:center">#</th>
                                                <th>Họ tên</th>
                                                <th>Ngày sinh</th>
                                                <th>Hạng ĐT</th>
                                                <th>Giới tính</th>
                                                <th>CMND</th>
                                                <th></th>
                                            </tr>
                                        </thead>
                                        <tbody id="tbodyid"></tbody>
                                    </table>
                                </fieldset>

                            </div>

                        </div>
                    </div>


                </div>
            </div>

            <div id="menu2" class="tab-pane fade">
                <br />

                <div id="tabs-3">

                    <div class="w3-row w3-border">
                        <div class="w3-col" style="width: 30%; border-right: 1px solid #ccc !important">
                            <div class="row margin-top-05">

                                <div style="width:100%">

                                </div>


                                <div style="width:100%; margin-top:10px; margin-bottom:10px">

                                    <div style="margin-left:10px">
                                        @Html.DropDownList("ddlKH_MA_AUTO", (SelectList)ViewBag.KH_MA_AUTOs, string.Empty, new { @title = "Vui lòng chọn khóa học...", @id = "ddlKH_MA_AUTO", @style = "font-weight:bold;width:300px" })


                                    </div>
                                    <br />
                                    <button type="button" class="btn btn-primary btn-sm" style="margin-left:10px" id="btnAddPhuongTienAuto" title="Thêm phương tiện số tự động" value="1">Thêm phương tiện số tự động</button>
                                </div>
                            </div>

                            <br />


                        </div>
                        <div class="w3-col" style="width:70%">

                            <div style="width: 100%; height:auto; ">
                                <fieldset class="fs_body" style="height:100%">
                                    <legend class="head_title">Phương tiện số tự động : <strong style="color:blue" id="strongPT_MA_AUTO"></strong></legend>
                                    <table class="table table-bordered table-striped" style="margin-top:10px" id="tblPT_AUTO">
                                        <thead>
                                            <tr>
                                                <th style="width:50px; text-align:center">#</th>
                                                <th>Tên khóa học</th>
                                                <th>Biển số</th>
                                                <th>Số học viên</th>
                                                <th></th>
                                            </tr>
                                        </thead>
                                        <tbody id="tbodyidAuto"></tbody>
                                    </table>
                                </fieldset>

                            </div>

                        </div>
                    </div>


                </div>
            </div>

        </div>
    </div>


    <br />

    <div class="row">
        <div class="col-md-12">

        </div>

    </div>

    <input type="text" id="txtPT_MA" style="display:none" />
    <input type="text" id="txtGV_MA" style="display:none" />

}

<link href="~/Content/w3.css" rel="stylesheet" />
<link href="~/Content/bootstrap-datetimepicker.min.css" rel="stylesheet" />

<link href="~/dist/css/bootstrap-select.css" rel="stylesheet" />
<script src="~/dist/js/bootstrap-select.js"></script>


<script src="~/Scripts/bootstrap-datetimepicker.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="~/Scripts/locales/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>

<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

<script src="~/Scripts/datepicker.js"></script>
<script src="~/Scripts/jquery-ui-1.11.4.js"></script>
<script src="~/Scripts/jquery.maskedinput.js"></script>
<script src="~/Scripts/jquery.maskMoney.js"></script>
<script src="~/Scripts/jquery.number.js"></script>
<script src="~/Scripts/jquery.masknumber.js"></script>
<script src="~/Scripts/moment.js"></script>

<link href="~/Scripts/select2.css" rel="stylesheet" />
<link href="~/Scripts/select2.min.css" rel="stylesheet" />
<script src="~/Scripts/select2.js"></script>


<script type="text/javascript">
    $(document).tooltip();
    toastr.options = {
        "debug": false,
        "positionClass": "toast-bottom-right",
        "fadeIn": 500,
        "fadeOut": 2000,
        "timeOut": 1000,
        "extendedTimeOut": 1000

    }

</script>
<script type="text/javascript">


    $(document).ready(function () {

        var pageSize = 20;
        var optionListUrl = '@Url.Action("Select2KH_MA_LH", "GPS_Ajax")';

        $('#ddlKH_MA').select2(
                {
                    ajax: {
                        delay: 50,
                        url: optionListUrl,
                        dataType: 'json',

                        data: function (params) {
                            /// params.page = params.page || 1;
                            return {
                                searchTerm: params.term,
                                dvgtvt_ma: $("#DVGTVT_MA").val()
                                //pageNumber: params.page results: JSON.parse(data)
                            };
                        },
                        processResults: function (data, params) {

                            return {
                                results: data.Results
                            };
                        }
                    },
                    placeholder: "-- Chọn khóa học --",
                    minimumInputLength: 2,
                    allowClear: true,
                    language: { inputTooShort: function () { return 'Nhập lớn hơn 2 ký tự để tìm kiếm khóa học'; } }
                });

        $('#ddlKH_MA_1').select2(
               {
                   ajax: {
                       delay: 50,
                       url: optionListUrl,
                       dataType: 'json',

                       data: function (params) {
                           /// params.page = params.page || 1;
                           return {
                               searchTerm: params.term,
                               dvgtvt_ma: $("#DVGTVT_MA").val()
                               //pageNumber: params.page results: JSON.parse(data)
                           };
                       },
                       processResults: function (data, params) {

                           return {
                               results: data.Results
                           };
                       }
                   },
                   placeholder: "-- Chọn khóa học --",
                   minimumInputLength: 2,
                   allowClear: true,
                   language: { inputTooShort: function () { return 'Nhập lớn hơn 2 ký tự để tìm kiếm khóa học'; } }
               });

        $('#ddlKH_MA_AUTO').select2(
               {
                   ajax: {
                       delay: 50,
                       url: optionListUrl,
                       dataType: 'json',

                       data: function (params) {
                           /// params.page = params.page || 1;
                           return {
                               searchTerm: params.term,
                               dvgtvt_ma: $("#DVGTVT_MA").val()
                               //pageNumber: params.page results: JSON.parse(data)
                           };
                       },
                       processResults: function (data, params) {

                           return {
                               results: data.Results
                           };
                       }
                   },
                   placeholder: "-- Chọn khóa học --",
                   minimumInputLength: 2,
                   allowClear: true,
                   language: { inputTooShort: function () { return 'Nhập lớn hơn 2 ký tự để tìm kiếm khóa học'; } }
               });


        //Hiển thị phương tiện khi change khóa học:

        $("#ddlKH_MA").on("change", function () {
            // lstBoxPhuongTien
            var position = $(this).position();

            $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
            $('#tbodyid').empty();

            $.ajax({
                url: '@Url.Action("getPT_IN_KH_MAs", "GPS_PhanCongLichHoc")',
                type: 'POST',
                traditional: true,
                data: {
                    Ma_KH: $(this).val(),
                    Ma_DVGT: ''
                },
                dataType: 'json',
                success: function (data) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    $("#lblKH_MA").text(data.khs[0].KH_MA);
                    $("#lblKH_TEN").text(data.khs[0].KH_TEN);
                    $("#lblKH_HANGDT").text(data.khs[0].KH_HANGDT);
                    $("#lblKH_HANGGPLX").text(data.khs[0].KH_HANGGPLX);
                    $("#lblKH_NGAY_KG").text(data.khs[0].KH_NGAY_KG);
                    $("#lblKH_NGAY_KT").text(data.khs[0].KH_NGAY_KT);
                    $("#txtKH_SOLUONGHOVIEN_1_PT").val(data.khs[0].KH_SOLUONGHOVIEN_1_PT);

                    // BindUlLiBienSo(data.pts);
                    BindUlLiBienSo_By_KH(data.pts);
                },
                error: function () {

                    alert("Lỗi kết nối với server!");
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                }
            });

        });



        $("#navPhuongTien").on("contextmenu", ".classphuongtien", function (e) {
            //prevent default context menu for right click
            e.preventDefault();
            var id = $(this).text();
            //$("#lblbienso").text(id);
            $("#txtPT_MA").val(id);
            var id_pt = $(this).attr("id");
            $("#txtID_PT").val(id_pt);

            var arr = $("#navPhuongTien").find(".classphuongtien").attr("class", "btn btn-info btn-sm classphuongtien");
            //  alert(arr.length);
            $(this).attr("class", "btn btn-danger btn-sm classphuongtien");

            //
            navULGiangVien = $(this).parent().find("ul");

            // lstBoxPhuongTien
            var position = $(this).position();

            //hiển thị giảng viên

            //  navULGiangVien = $(this).parent().find("ul");
            var pt_ma = $(this).text();
            var position = $(this).position();
            $("#strongPT_MA").text(pt_ma);

            $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

            $.ajax({
                url: '@Url.Action("GPS_GET_GV_IN_PT", "GPS_PhanCongLichHoc")',
                type: 'POST',
                traditional: true,
                data: { Ma_KH: $("#ddlKH_MA").val(), Ma_PT: pt_ma },
                dataType: 'json',
                success: function (data) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    navULGiangVien.empty();
                    //if (data.gvs.length > 0) {
                    //bind giảng viên thuộc phương tiện
                    BindUlLiGiangVien(data.gvs.lstGV_IN_PT);

                    //bind học viên thuộc phương tiện
                    BindDataTableHocVien(data.gvs.lstHV_IN_PT);

                    // }
                    // toastr.success('Cập nhật thành công!', 'thông báo');


                    $(".menugiangvien").hide();
                    var menu = $(".menuphuongtien");

                    //hide menu if already shown
                    menu.hide();

                    //get x and y values of the click event
                    var pageX = e.pageX;
                    var pageY = e.pageY;

                    //position menu div near mouse cliked area
                    menu.css({ top: pageY, left: pageX });

                    var mwidth = menu.width();
                    var mheight = menu.height();
                    var screenWidth = $(window).width();
                    var screenHeight = $(window).height();

                    //if window is scrolled
                    var scrTop = $(window).scrollTop();

                    //if the menu is close to right edge of the window
                    if (pageX + mwidth > screenWidth) {
                        menu.css({ left: pageX - mwidth });
                    }

                    //if the menu is close to bottom edge of the window
                    if (pageY + mheight > screenHeight + scrTop) {
                        menu.css({ top: pageY - mheight });
                    }

                    //finally show the menu
                    menu.show();


                },
                error: function () {

                    alert("Lỗi kết nối với server!");
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    //$('#myModalHocvien').modal('toggle');
                }
            });

            //END


            //  alert(navULGiangVien.attr("class"));



        });

        $("#navPhuongTien").on("click", ".classphuongtien", function (e) {
            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();
            var arr = $("#navPhuongTien").find(".classphuongtien").attr("class", "btn btn-info btn-sm classphuongtien");
            $(this).attr("class", "btn btn-danger btn-sm classphuongtien");


            //prevent default context menu for right click
            e.preventDefault();
            //   var gv_ma = $(this).text();$('.sys').find('input[type=text],select').each(function() {...})
            navULGiangVien = $(this).parent().find("ul");
            var pt_ma = $(this).text();
            var position = $(this).position();
            $("#strongPT_MA").text(pt_ma);

            $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

            $.ajax({
                url: '@Url.Action("GPS_GET_GV_IN_PT", "GPS_PhanCongLichHoc")',
                type: 'POST',
                traditional: true,
                data: { Ma_KH: $("#ddlKH_MA").val(), Ma_PT: pt_ma },
                dataType: 'json',
                success: function (data) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    navULGiangVien.empty();
                    //if (data.gvs.length > 0) {
                    //bind giảng viên thuộc phương tiện
                    BindUlLiGiangVien(data.gvs.lstGV_IN_PT);

                    //bind học viên thuộc phương tiện
                    BindDataTableHocVien(data.gvs.lstHV_IN_PT);

                    // }
                    // toastr.success('Cập nhật thành công!', 'thông báo');

                },
                error: function () {

                    alert("Lỗi kết nối với server!");
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    //$('#myModalHocvien').modal('toggle');
                }
            });

        });

        //$("#btnthemgiangvien").on("click", function () {
        //    $("#myModalGiangVien").modal();
        //});

        $("#btndonglaiphuongtien").on("click", function () {
            $(".menuphuongtien").hide();
            var arr = $("#navPhuongTien").find(".classphuongtien").attr("class", "btn btn-info btn-sm classphuongtien");

        });





        //giảng viên:

        $("#navPhuongTien").on("contextmenu", ".classgiangvien", function (e) {
            //prevent default context menu for right click
            e.preventDefault();

            var id = $(this).val();
            //$("#lblgiangvien").text(id);
            $("#txtGV_MA").val(id);
            var id_gv = $(this).attr("id");
            //   alert(id_gv);
            $("#txtID_GV").val(id_gv);

            navULGiangVien = $(this).parent().parent();

            $(".menuphuongtien").hide();
            var menu = $(".menugiangvien");

            //hide menu if already shown
            menu.hide();

            //get x and y values of the click event
            var pageX = e.pageX;
            var pageY = e.pageY;

            //position menu div near mouse cliked area
            menu.css({ top: pageY, left: pageX });

            var mwidth = menu.width();
            var mheight = menu.height();
            var screenWidth = $(window).width();
            var screenHeight = $(window).height();

            //if window is scrolled
            var scrTop = $(window).scrollTop();

            //if the menu is close to right edge of the window
            if (pageX + mwidth > screenWidth) {
                menu.css({ left: pageX - mwidth });
            }

            //if the menu is close to bottom edge of the window
            if (pageY + mheight > screenHeight + scrTop) {
                menu.css({ top: pageY - mheight });
            }

            //finally show the menu
            menu.show();
        });

        //Get học viên thuộc giảng viên quản lý === giờ không dùng
        @*$("#navPhuongTien").on("click", ".classgiangvien", function (e) {
            //prevent default context menu for right click
            e.preventDefault();
            //   var gv_ma = $(this).text();$('.sys').find('input[type=text],select').each(function() {...})

            var gv_ma = $(this).val();
            var position = $(this).position();

            $("#wait").attr("style", "display:block;position:absolute;top:" + position.top + ";left:" + position.top + ";padding:2px; z-index:99999");

            $.ajax({
                url: '@Url.Action("GPS_GET_HV_IN_PT", "GPS_PhanCongLichHoc")',
                type: 'POST',
                traditional: true,
                data: { Ma_KH: $("#ddlKH_MA").val(), Ma_GV: gv_ma },
                dataType: 'json',
                success: function (data) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    // $("#lbldanhsachbienso").text(str);
                    if (data.hvs.length > 0) {
                        BindDataTableHocVien(data.hvs);
                    }
                    //  $('#myModalHocvien').modal('toggle');

                },
                error: function () {

                    alert("Lỗi kết nối với server!");
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    //$('#myModalHocvien').modal('toggle');
                }
            });

        });*@



        //$("#btnthemhocvien").on("click", function () {
        //    $("#myModalHocvien").modal();
        //});

        $("#btndonglaigiangvien").on("click", function () {
            $(".menugiangvien").hide();
        });



        //$(function () {
        //    $('#modal').modal('toggle');
        //});

        //$("#fireme").click(function () {
        //    $("#EnSureModal").modal();
        //});




        //========Thêm mới phương tiện vào khóa học

        var phuongtienkeys = [];
        var phuongtienvalues = [];

        $("#btnAddPhuongTien").on("click", function () {
            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();

            var valKH = $("#ddlKH_MA").val();
            if (valKH != null && valKH != '') {
                // lstBoxPhuongTien
                var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
                $.ajax({
                    url: '@Url.Action("getGPS_GET_PT_NOTIN_KHs", "GPS_PhanCongLichHoc")',
                    type: 'post',
                    data: {
                        Ma_KH: valKH,
                        Ma_DVGT: ''
                    }
                }).done(function (response) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    var a = response;
                    $("#lstBoxPhuongTien").html(a);
                    var options = $('#lstBoxPhuongTien option');
                    phuongtienkeys = [];
                    phuongtienvalues = [];
                    $.each(options, function (index, item) {

                        phuongtienkeys.push(item.value);
                        phuongtienvalues.push(item.innerHTML);

                    });
                    //   alert(phuongtienkeys.length);
                    $("#myModalPhuongTien").modal();

                });



            }
            else {
                alert('Hãy chọn khóa học!');
            }

        });


        //searh list box phương tiện

        $('#txtSearchPhuongTien').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxPhuongTien', filter, phuongtienkeys, phuongtienvalues);
        });


        //==========Cập nhật phương tiện:

        $("#btnSavePhuongTien").on("click", function () {


            if ($('#lstBoxPhuongTien :selected').length > 0) {
                //build an array of selected values
                var selectednumbers = [];
                $('#lstBoxPhuongTien :selected').each(function (i, selected) {
                    selectednumbers[i] = $(selected).val();
                });
               // alert(selectednumbers.length);
                //var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("CreateDKH_PT", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_PT_KH_MA: $("#ddlKH_MA").val(), KH_PT_PT_MAs: JSON.stringify(selectednumbers) },
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");


                        //  BindUlLiBienSo(data.pts);
                        BindUlLiBienSo_By_KH(data.pts);

                        //$("#lbldanhsachbienso").text(str);
                        $('#myModalPhuongTien').modal('toggle');

                        toastr.success('Cập nhật thành công!', 'thông báo');
                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                        $('#myModalPhuongTien').modal('toggle');
                    }
                });

                phuongtienkeys = [];
                phuongtienvalues = [];
            }

            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();
        });

        //Delete phương tiện

        $("#btnxoaphuongtien").on("click", function () {
            var isGood = confirm('Bạn Chắc chắn? Chú ý: Xóa phương tiện thì lịch học của phương tiện, giảng viên, học viên thuộc phương tiện cũng bị xóa!');
            if (isGood) {
                var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("DeleteDKH_PT", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_MA: $("#ddlKH_MA").val(), PT_MA: $("#" + $("#txtID_PT").val()).text() }, // PT_MA: $("#txtPT_MA").val()
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                        // BindUlLiBienSo(data.pts);
                        BindUlLiBienSo_By_KH(data.pts);
                        $('#tbodyid').empty();
                        toastr.success('Xóa thành công!', 'thông báo');
                        $('#tbodyid').empty();
                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    }
                });
            }

            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();

        });





        //========Thêm mới giảng viên vào khóa học

        var giangvienkeys = [];
        var giangvienvalues = [];

        $("#btnthemgiangvien").on("click", function () {
            var btnPT_MA = $("#" + $("#txtID_PT").val());
            var size = btnPT_MA.parent().children("ul").children("li").size();
            //  alert(size);
            // alert(size);
            if (size < 1) {
                //if (btnPT_MA.parent())
                // lstBoxPhuongTien
                var position = $(this).parent().parent().parent().position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
                $.ajax({
                    url: '@Url.Action("getGPS_GET_GV_NOTIN_PTs", "GPS_PhanCongLichHoc")',
                    type: 'post',
                    data: {
                        Ma_DVGT: '',
                        Ma_KH: $("#ddlKH_MA").val(),
                        PT_MA: $("#" + $("#txtID_PT").val()).text()
                    }
                }).done(function (response) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    var a = response;
                    $("#lstBoxGiangVien").html(a);
                    var options = $('#lstBoxGiangVien option');
                    giangvienkeys = [];
                    giangvienvalues = [];
                    $.each(options, function (index, item) {

                        giangvienkeys.push(item.value);
                        giangvienvalues.push(item.innerHTML);

                    });
                    //  alert(phuongtienkeys.length);
                    $("#myModalGiangVien").modal();

                });

            }
            else {
                alert("Mỗi phương tiện chỉ thuộc 1 giáo viên quản lý!");
            }


        });



        //searh list box Giảng Viên

        $('#txtSearchGiangVien').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxGiangVien', filter, giangvienkeys, giangvienvalues);
        });


        //==========Cập nhật Giảng Viên:

        $("#btnSaveGiangVien").on("click", function () {
            if ($('#lstBoxGiangVien :selected').length > 0) {
                //build an array of selected values
                var selectednumbers = [];
                $('#lstBoxGiangVien :selected').each(function (i, selected) {
                    selectednumbers[i] = $(selected).val();
                });

                //alert(selectednumbers.length);

                var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("CreateDKH_GV", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_GV_KH_MA: $("#ddlKH_MA").val(), KH_PT_GV_PT_MA: $("#" + $("#txtID_PT").val()).text(), KH_GV_GV_MAs: JSON.stringify(selectednumbers) },
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                        navULGiangVien.empty();
                        if (data.gvs.length > 0) {

                            BindUlLiGiangVien(data.gvs);
                        }

                        $('#myModalGiangVien').modal('toggle');

                        toastr.success('Cập nhật thành công!', 'thông báo');

                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                        $('#myModalGiangVien').modal('toggle');
                    }
                });

                giangvienkeys = [];
                giangvienvalues = [];

            }

            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();
        });


        //Delete giảng viên:

        $("#btnxoagiangvien").on("click", function () {

            var isGood = confirm('Bạn Chắc chắn? Chú ý: Xóa giảng viên thì lịch học của giảng viên cũng bị xóa!');
            if (isGood) {
                var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("DeleteDKH_GV", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_MA: $("#ddlKH_MA").val(), GV_MA: $("#txtGV_MA").val() }, // $("#" + $("#txtID_GV").val()).val()
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                        navULGiangVien.empty();
                        if (data.gvs.length > 0) {

                            BindUlLiGiangVien(data.gvs);
                        }
                        toastr.success('Xóa thành công!', 'thông báo');
                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    }
                });


            }

            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();

        });


        //========Thêm mới Học viên vào khóa học

        var hocvienkeys = [];
        var hocvienvalues = [];

        $("#btnthemhocvien").on("click", function () {

            var size = $('#tbodyid tr').length;
            var soluongHVMAX = parseInt($("#txtKH_SOLUONGHOVIEN_1_PT").val());
            //alert(size + ";" + soluongHVMAX);
            if (size < soluongHVMAX) {

                // lstBoxPhuongTien
                var position = $(this).parent().parent().parent().position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
                $.ajax({
                    url: '@Url.Action("getGPS_GET_HV_NOTIN_PTs", "GPS_PhanCongLichHoc")',
                    type: 'post',
                    data: {
                        Ma_DVGT: '',
                        Ma_KH: $("#ddlKH_MA").val(),
                        PT_MA: $("#" + $("#txtID_PT").val()).text()
                    }
                }).done(function (response) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    var a = response;
                    $("#lstBoxHocVien").html(a);
                    //   alert(response);
                    var options = $('#lstBoxHocVien option');
                    hocvienkeys = [];
                    hocvienvalues = [];
                    $.each(options, function (index, item) {

                        hocvienkeys.push(item.value);
                        hocvienvalues.push(item.innerHTML);

                    });
                    //  alert(phuongtienkeys.length);
                    $("#myModalHocvien").modal();

                });

            }
            else {
                var hangdt = $("#lblKH_HANGDT").text();
                alert("Hạng đào tạo " + hangdt + " chỉ được tối đa " + soluongHVMAX + " trên phương tiện");
            }



        });


        //searh list box Học Viên

        $('#txtSearchHocvien').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxHocVien', filter, hocvienkeys, hocvienvalues);
        });


        //==========Cập nhật Học Viên:

        $("#btnSaveHocVien").on("click", function () {
            if ($('#lstBoxHocVien :selected').length > 0) {
                var size = $('#tbodyid tr').length;
                var soluongHVMAX = parseInt($("#txtKH_SOLUONGHOVIEN_1_PT").val());
                var delta = soluongHVMAX - size;
                //build an array of selected values
                var selectednumbers = [];
                $('#lstBoxHocVien :selected').each(function (i, selected) {
                    selectednumbers[i] = $(selected).val();
                });
                if (selectednumbers.length <= delta) {
                    // alert(selectednumbers.length);


                    var position = $(this).position();

                    $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                    $.ajax({
                        url: '@Url.Action("CreateDKH_HV", "GPS_PhanCongLichHoc")',
                        type: 'POST',
                        traditional: true,
                        data: { KH_HV_KH_MA: $("#ddlKH_MA").val(), KH_HV_PT_MA: $("#" + $("#txtID_PT").val()).text(), KH_HV_HV_MAs: JSON.stringify(selectednumbers) },
                        dataType: 'json',
                        success: function (data) {
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                            //var str = "";
                            //for (var i = 0; i < selectednumbers.length; i++) {
                            //    str = str + selectednumbers[i] + ",";

                            //}
                            //$("#lbldanhsachbienso").text(str);
                            if (data.hvs.length > 0) {
                                BindDataTableHocVien(data.hvs);
                            }
                            $('#myModalHocvien').modal('toggle');

                            toastr.success('Cập nhật thành công!', 'thông báo');

                        },
                        error: function () {

                            alert("Lỗi kết nối với server!");
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                            $('#myModalHocvien').modal('toggle');
                        }
                    });

                    hocvienkeys = [];
                    hocvienvalues = [];
                }
                else {
                    var hangdt = $("#lblKH_HANGDT").text();
                    alert("Hạng đào tạo " + hangdt + " chỉ được tối đa " + soluongHVMAX + " trên phương tiện, bạn chỉ được thêm " + delta + " học viên");
                }

            }

            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();
        });

        //Delete học viên khỏi phương tiện
        $("#tbodyid").on("click", ".deleteHV", function () {
            var isGood = confirm('Bạn Chắc chắn?');
            if (isGood) {
                var id_hv = $(this).attr('id');
                //   alert(id_hv);
                var id_inputhv = 'inputhv_' + id_hv.split('_')[1];
                //  alert(id_inputhv + ';' + $("#" + id_inputhv).val());
                var position = $(this).position();



                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("DeleteDKH_HV", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_MA: $("#ddlKH_MA").val(), HV_MA: $("#" + id_inputhv).val() },
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                        BindDataTableHocVien(data.hvs);

                        toastr.success('Xóa thành công!', 'thông báo');
                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    }
                });
            }



        });




        $("#btnHuyBoGiangVien").click(function () {
            giangvienkeys = [];
            giangvienvalues = [];
            $('#myModalGiangVien').modal('toggle');
        });

        $("#btnHuyBoPhuongTien").click(function () {
            phuongtienkeys = [];
            phuongtienvalues = [];
            $('#myModalPhuongTien').modal('toggle');
        });

        $("#btnHuyBoHocVien").click(function () {
            hocvienkeys = [];
            hocvienvalues = [];
            $('#myModalHocvien').modal('toggle');
        });



        //find listbox
        function DoListBoxFilter(listBoxSelector, filter, keys, values) {
            var list = $(listBoxSelector);
            var selectBase = '<option value="{0}">{1}</option>';

            list.empty();
            for (i = 0; i < values.length; ++i) {

                var value = values[i];

                if (value == "" || value.toLowerCase().indexOf(filter.toLowerCase()) >= 0) {
                    var temp = '<option value="' + keys[i] + '">' + value + '</option>';
                    list.append(temp);
                }
            }
        }


        ////-===== apppend thêm phương tiện và giảng viên

        function BindDataTableHocVien(json) {

            $('#tbodyid').empty();
            var tr;
            for (var i = 0; i < json.length; i++) {
                tr = $('<tr/>');
                tr.append("<td>" + (i + 1) + "</td>");
                tr.append("<td>" + json[i].HV_HOTEN + "</td>");
                tr.append("<td>" + json[i].HV_NGAYSINH + "</td>");
                tr.append("<td>" + json[i].HV_HANGDT_MA + "</td>");
                tr.append("<td>" + json[i].HV_GIOITINH + "</td>");
                tr.append("<td>" + json[i].HV_SOCMT + "</td>");

                var _td = '<td>' +
                          ' <a href="javascript:void()"  class="deleteHV" id="hv_' + i + '"><img src="@Url.Content("~/fonts/grid-delete-icon1.gif")" title="Xóa học viên khóa học"  />'
                            + '</a> <input type="text" class="classHV_MA" style="display:none" value="' + json[i].HV_MA + '#' + json[i].HV_PT_MA + '" id="inputhv_' + i + '" />' +
                          '</td>';
                tr.append(_td);

                $('#tbodyid').append(tr);
            }
        }

        function navPhuongTienAppend(bienso, i) {
            $("#navPhuongTien").append('<li class="clickable"><button type="button" class="btn btn-info btn-sm classphuongtien" id="ID_PT_' + i + '" title =" Click Chuột trái để xem giảng viên; chuột phải để xem thao tác" >' + bienso + '</button><ul style="list-style:none" class="sf-menu-sub giangvien"></ul></li>');
        }


        function BindUlLiBienSo_By_KH(json) {

            $('#navPhuongTien').empty();

            var strGV = '<ul style="list-style:none" class="sf-menu-sub giangvien">';
            for (var i = 0; i < json.length; i++) {
                if (json[i].KH_PT_GV_MA != null && json[i].KH_PT_GV_MA != '') {
                    strGV = strGV + '<li class="clickable"><input type="text" style="display:none" value="' + json[i].KH_PT_GV_MA + '" /><button type="button" class="btn btn-success btn-sm classgiangvien" value="' + json[i].KH_PT_GV_MA + '#' + json[i].PT_MA + '" id="ID_GV_' + i + '"  title="Click chuột phải để xem thao tác">' + json[i].GV_HOTEN + '</button></li>';
                }

                $("#navPhuongTien").append('<li class="clickable"><button type="button" class="btn btn-info btn-sm classphuongtien" id="ID_PT_' +
                  i + '" title =" Click Chuột trái để xem giảng viên; chuột phải để xem thao tác" >' +
                  json[i].PT_MA + '</button>' + strGV
                  + '</ul></li>'
                );

                strGV = '<ul style="list-style:none" class="sf-menu-sub giangvien">';
            }
        }

        function BindUlLiBienSo(json) {

            $('#navPhuongTien').empty();

            for (var i = 0; i < json.length; i++) {
                navPhuongTienAppend(json[i].PT_MA, i);
            }
        }

        var navULGiangVien = null;
        function navGiangVienAppend(hoten, magv, i) {
            navULGiangVien.append('<li class="clickable"><input type="text" style="display:none" value="' + magv + '" /><button type="button" class="btn btn-success btn-sm classgiangvien" value="' + magv + '" id="ID_GV_' + i + '"  title="Click chuột phải để xem thao tác">' + hoten + '</button></li>');
        }

        function BindUlLiGiangVien(json) {


            for (var i = 0; i < json.length; i++) {
                navGiangVienAppend(json[i].GV_HOTEN, json[i].GV_MA + '#' + json[i].PT_MA, i);
            }
        }



        //$('.selectpicker').selectpicker({
        //    liveSearch: true,
        //    showSubtext: true
        //});


        //....thực hiện insert, delete học viên vào khóa học và ngược lại:
        var giangvienIN_KH_keys = [];
        var giangvienIN_KH_values = [];

        var giangvienNOT_IN_KH_keys = [];
        var giangvienNOT_IN_KH_values = [];

        $("#ddlKH_MA_1").on("change", function () {
            var _val = $(this).val();
            if (_val=!null && _val!="")
            {
                // lstBoxPhuongTien
                var position = $(this).position();
                $("#strongKH_1").text($("#ddlKH_MA_1 option:selected").text());

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");



                $.ajax({
                    url: '@Url.Action("GetGV_IN_NOTIN_KH", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: {
                        Ma_KH: $(this).val(),
                        Ma_DVGT: ''
                    },
                    dataType: 'json',
                    success: function (data) {
                        //if (data != null)
                        //{
                        //    alert(data);
                        //}

                        //alert('1');
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                        $("#lstBoxGV_IN_KH").empty();
                        if (data.gvs.lstGV_KH_IN != null && data.gvs.lstGV_KH_IN.length > 0) {

                            giangvienIN_KH_keys = [];
                            giangvienIN_KH_values = [];

                            BindDataListBoxIn(data.gvs.lstGV_KH_IN);

                            var options = $('#lstBoxGV_IN_KH option');
                            $.each(options, function (index, item) {

                                giangvienIN_KH_keys.push(item.value);
                                giangvienIN_KH_values.push(item.innerHTML);

                            });
                        }


                        $("#lstBoxGV_NOTIN_KH").empty();
                        if (data.gvs.lstGV_KH_NOTIN.length > 0) {
                            giangvienNOT_IN_KH_keys = [];
                            giangvienNOT_IN_KH_values = [];

                            BindDataListBoxNotIn(data.gvs.lstGV_KH_NOTIN);

                            var options = $('#lstBoxGV_NOTIN_KH option');
                            $.each(options, function (index, item) {

                                giangvienNOT_IN_KH_keys.push(item.value);
                                giangvienNOT_IN_KH_values.push(item.innerHTML);

                            });

                        }
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        $("#lstBoxGV_NOTIN_KH").empty();
                        $("#lstBoxGV_IN_KH").empty();
                        //alert(textStatus);
                        if (textStatus == 'timeout')
                            console.log('The server is not responding');

                        if (textStatus == 'error')
                            alert(errorThrown);

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    }
                });

            }
            else
            {
                $("#lstBoxGV_NOTIN_KH").empty();
                $("#lstBoxGV_IN_KH").empty();
                $("#strongKH_1").text('');
            }

           
        });


        //Insert
        $("#btnRight").click(function () {
            if ($('#lstBoxGV_NOTIN_KH :selected').length > 0) {
                //build an array of selected values
                var selectednumbers = [];
                $('#lstBoxGV_NOTIN_KH :selected').each(function (i, selected) {
                    selectednumbers[i] = $(selected).val();
                });

                // alert(selectednumbers.length);


                var position = $(this).position();

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                $.ajax({
                    url: '@Url.Action("CreateDKH_GV_IN_NOTIN", "GPS_PhanCongLichHoc")',
                    type: 'POST',
                    traditional: true,
                    data: { KH_GV_KH_MA: $("#ddlKH_MA_1").val(), isaction: 'I', KH_GV_GV_MAs: JSON.stringify(selectednumbers) },
                    dataType: 'json',
                    success: function (data) {
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                        var str = "";
                        for (var i = 0; i < selectednumbers.length; i++) {
                            str = str + selectednumbers[i] + ",";

                        }

                        if (data != null) {
                            giangvienIN_KH_keys = [];
                            giangvienIN_KH_values = [];
                            BindDataListBoxIn(data.gvs.lstGV_KH_IN);

                            var options = $('#lstBoxGV_IN_KH option');
                            $.each(options, function (index, item) {

                                giangvienIN_KH_keys.push(item.value);
                                giangvienIN_KH_values.push(item.innerHTML);

                            });

                            giangvienNOT_IN_KH_keys = [];
                            giangvienNOT_IN_KH_values = [];
                            BindDataListBoxNotIn(data.gvs.lstGV_KH_NOTIN);

                            var options = $('#lstBoxGV_NOTIN_KH option');
                            $.each(options, function (index, item) {

                                giangvienNOT_IN_KH_keys.push(item.value);
                                giangvienNOT_IN_KH_values.push(item.innerHTML);

                            });
                            toastr.success('Cập nhật thành công!', 'thông báo');
                        }
                        else {
                            alert("Lỗi cập nhật dữ liệu!");
                        }

                        $('#txtSearchGV_IN_KH').val('');
                        $('#txtSearchGV_NOTIN_KH').val('');
                      
                    },
                    error: function () {

                        alert("Lỗi kết nối với server!");
                        $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    }
                });

                //hocvienkeys = [];
                //hocvienvalues = [];
            }
        });


        //Delete
        $("#btnLeft").click(function () {
            var isGood = confirm('Bạn Chắc chắn? Chú ý: nếu xóa giảng viên ra khỏi khóa học thì những lịch học của giảng viên cũng bị xóa!!!');
            if (isGood) {
                if ($('#lstBoxGV_IN_KH :selected').length > 0) {
                    //build an array of selected values
                    var selectednumbers = [];
                    $('#lstBoxGV_IN_KH :selected').each(function (i, selected) {
                        selectednumbers[i] = $(selected).val();
                    });

                    // alert(selectednumbers.length);


                    var position = $(this).position();

                    $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                    $.ajax({
                        url: '@Url.Action("CreateDKH_GV_IN_NOTIN", "GPS_PhanCongLichHoc")',
                        type: 'POST',
                        traditional: true,
                        data: { KH_GV_KH_MA: $("#ddlKH_MA_1").val(), isaction: 'D', KH_GV_GV_MAs: JSON.stringify(selectednumbers) },
                        dataType: 'json',
                        success: function (data) {
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                            var str = "";
                            for (var i = 0; i < selectednumbers.length; i++) {
                                str = str + selectednumbers[i] + ",";

                            }
                            if (data != null) {
                                giangvienIN_KH_keys = [];
                                giangvienIN_KH_values = [];
                                BindDataListBoxIn(data.gvs.lstGV_KH_IN);

                                var options = $('#lstBoxGV_IN_KH option');
                                $.each(options, function (index, item) {

                                    giangvienIN_KH_keys.push(item.value);
                                    giangvienIN_KH_values.push(item.innerHTML);

                                });

                                giangvienNOT_IN_KH_keys = [];
                                giangvienNOT_IN_KH_values = [];
                                BindDataListBoxNotIn(data.gvs.lstGV_KH_NOTIN);

                                var options = $('#lstBoxGV_NOTIN_KH option');
                                $.each(options, function (index, item) {

                                    giangvienNOT_IN_KH_keys.push(item.value);
                                    giangvienNOT_IN_KH_values.push(item.innerHTML);

                                });
                                toastr.success('Cập nhật thành công!', 'thông báo');
                            }
                            else
                            {
                                alert("Lỗi cập nhật dữ liệu!");
                            }
                            $('#txtSearchGV_IN_KH').val('');
                            $('#txtSearchGV_NOTIN_KH').val('');
                          
                        },
                        error: function () {

                            alert("Lỗi kết nối với server!");
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                        }
                    });

                    //hocvienkeys = [];
                    //hocvienvalues = [];
                }
            }

        });

        //searh list box giảng viên not in Khóa học

        $('#txtSearchGV_NOTIN_KH').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxGV_NOTIN_KH', filter, giangvienNOT_IN_KH_keys, giangvienNOT_IN_KH_values);
        });

        //searh list box giảng viên  in Khóa học

        $('#txtSearchGV_IN_KH').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxGV_IN_KH', filter, giangvienIN_KH_keys, giangvienIN_KH_values);
        });


        function BindDataListBoxIn(json) {

            $("#lstBoxGV_IN_KH").empty();
            for (i = 0; i < json.length; i++) {
                var temp = '<option value="' + json[i].GV_MA + '">' + json[i].GV_HOTEN + '- CMND:' + json[i].GV_SOCMT + '- Hạng ĐT:' + json[i].GV_HANGDT_MA + '-' + json[i].GV_HTDTAO_MA + '</option>';
                $("#lstBoxGV_IN_KH").append(temp);

            }
        }

        function BindDataListBoxNotIn(json) {

            $("#lstBoxGV_NOTIN_KH").empty();
            for (i = 0; i < json.length; i++) {
                var temp = '<option value="' + json[i].GV_MA + '">' + json[i].GV_HOTEN + '- CMND:' + json[i].GV_SOCMT + '- Hạng ĐT:' + json[i].GV_HANGDT_MA + '-' + json[i].GV_HTDTAO_MA + '</option>';
                $("#lstBoxGV_NOTIN_KH").append(temp);

            }
        }

        //function BindDataListBoxIn(json) {

        //    $("#lstBoxGV_IN_KH").empty();
        //    for (i = 0; i < json.length; i++) {
        //        var temp = '<option value="' + json[i].GV_MA + '">' + json[i].GV_HOTEN + '- CMND:' + json[i].GV_SOCMT + '- Hạng ĐT:' + json[i].GV_HANGDT_MA + '</option>';
        //        $("#lstBoxGV_IN_KH").append(temp);

        //    }
        //}

        //function BindDataListBoxNotIn(json) {

        //    $("#lstBoxGV_NOTIN_KH").empty();
        //    for (i = 0; i < json.length; i++) {
        //        var temp = '<option value="' + json[i].GV_MA + '">' + json[i].GV_HOTEN + '- CMND:' + json[i].GV_SOCMT + '- Hạng ĐT:' + json[i].GV_HANGDT_MA + '</option>';
        //        $("#lstBoxGV_NOTIN_KH").append(temp);

        //    }
        //}



        ///Thêm phương tiện auto
        //Hiển thị phương tiện khi change khóa học:

        $("#ddlKH_MA_AUTO").on("change", function () {
            // lstBoxPhuongTien
            var position = $(this).position();

            $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
            $('#tbodyidAuto').empty();

            $.ajax({
                url: '@Url.Action("getPT_AUTO_IN_KH_MAs", "GPS_PhanCongLichHoc")',
                type: 'POST',
                traditional: true,
                data: {
                    Ma_KH: $(this).val(),
                    Ma_DVGT: ''
                },
                dataType: 'json',
                success: function (data) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                    BindUlLiBienSoAuTo(data.pts);
                },
                error: function () {

                    alert("Lỗi kết nối với server!");
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                }
            });

        });


        var phuongtienAUTOkeys = [];
        var phuongtienAUTOvalues = [];

        $("#btnAddPhuongTienAuto").on("click", function () {
            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();

            var valKH = $("#ddlKH_MA_AUTO").val();
            if (valKH != null && valKH != '') {

                $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");
                $.ajax({
                    url: '@Url.Action("getGPS_GET_PT_AUTO_NOTIN_KHs", "GPS_PhanCongLichHoc")',
                    type: 'post',
                    data: {
                        Ma_KH: valKH,
                        Ma_DVGT: ''
                    }
                }).done(function (response) {
                    $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                    var a = response;
                    $("#lstBoxPhuongTienAuTo").html(a);
                    var options = $('#lstBoxPhuongTienAuTo option');
                    phuongtienAUTOkeys = [];
                    phuongtienAUTOvalues = [];
                    $.each(options, function (index, item) {

                        phuongtienAUTOkeys.push(item.value);
                        phuongtienAUTOvalues.push(item.innerHTML);

                    });

                    $("#myModalPhuongTienAuto").modal();

                });



            }
            else {
                alert('Hãy chọn khóa học!');
            }

        });


        //searh list box phương tiện

        $('#txtSearchPhuongTienAuTo').keyup(function () {
            var filter = $(this).val();
            //  alert(filter);
            DoListBoxFilter('#lstBoxPhuongTienAuTo', filter, phuongtienAUTOkeys, phuongtienAUTOvalues);
        });


        //==========Cập nhật phương tiện:

        $("#btnSavePhuongTienAuTo").on("click", function () {
            if ($("#ddlKH_MA_AUTO").val() != null && $("#ddlKH_MA_AUTO").val() != '') {



                if ($("#txtKH_PT_AUTO_SOHV").val() != null && $("#txtKH_PT_AUTO_SOHV").val() != '') {
                    if ($('#lstBoxPhuongTienAuTo :selected').length > 0) {
                        //build an array of selected values
                        var selectednumbers = [];
                        $('#lstBoxPhuongTienAuTo :selected').each(function (i, selected) {
                            selectednumbers[i] = $(selected).val();
                        });



                        $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                        $.ajax({
                            url: '@Url.Action("CreateDKH_PT_AUTO", "GPS_PhanCongLichHoc")',
                            type: 'POST',
                            traditional: true,
                            data: { KH_PT_AUTO_SOHV: $("#txtKH_PT_AUTO_SOHV").val(), KH_PT_AUTO_MOTA: $("#txtKH_PT_AUTO_MOTA").val(), KH_PT_AUTO_KH_MA: $("#ddlKH_MA_AUTO").val(), KH_PT_AUTO_KH_MAs: JSON.stringify(selectednumbers) },
                            dataType: 'json',
                            success: function (data) {
                                $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                                BindUlLiBienSoAuTo(data.pts);

                                $('#myModalPhuongTienAuto').modal('toggle');

                                toastr.success('Cập nhật thành công!', 'thông báo');
                            },
                            error: function () {

                                alert("Lỗi kết nối với server!");
                                $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");
                                $('#myModalPhuongTienAuto').modal('toggle');
                            }
                        });

                        phuongtienAUTOkeys = [];
                        phuongtienAUTOvalues = [];
                    }

                }
                else
                {
                    alert('Số lượng học viên trên xe bắt buộc nhập!');
                }

            }
            $(".menugiangvien").hide();
            $(".menuphuongtien").hide();
        });


        $("#btnHuyBoPhuongTienAuTo").click(function () {
            phuongtienAUTOkeys = [];
            phuongtienAUTOvalues = [];
            $('#myModalPhuongTienAuto').modal('toggle');
        });

        //Delete phương tiện AUTO
        $("#tbodyidAuto").on("click", ".deletePT_AUTO", function () {

            if ($("#ddlKH_MA_AUTO").val() != null && $("#ddlKH_MA_AUTO").val() != '') {
                var isGood = confirm('Bạn Chắc chắn?');
                if (isGood) {
                    var id_pt = $(this).attr('id');
                    //   alert(id_hv);
                    var id_inputAUTO = 'inputAUTO_' + id_pt.split('_')[1];


                    $("#wait").attr("style", "display:block;position:absolute;top:40%;left:50%;padding:2px; z-index:99999");

                    $.ajax({
                        url: '@Url.Action("DeleteDKH_PT_AUTO", "GPS_PhanCongLichHoc")',
                        type: 'POST',
                        traditional: true,
                        data: { KH_MA: $("#ddlKH_MA_AUTO").val(), id: $("#" + id_inputAUTO).val() },
                        dataType: 'json',
                        success: function (data) {
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                            BindUlLiBienSoAuTo(data.pts);

                            toastr.success('Xóa thành công!', 'thông báo');
                        },
                        error: function () {

                            alert("Lỗi kết nối với server!");
                            $("#wait").attr("style", "display:none;position:absolute;top:20%;left:50%;padding:2px; z-index:99999");

                        }
                    });
                }

            }




        });

        ////-===== apppend thêm phương tiện AUTO

        function BindUlLiBienSoAuTo(json) {

            $('#tbodyidAuto').empty();
            var tr;
            for (var i = 0; i < json.length; i++) {
                tr = $('<tr/>');
                tr.append("<td>" + (i + 1) + "</td>");
                tr.append("<td>" + json[i].KH_TEN + "</td>");
                tr.append("<td>" + json[i].PT_MA + "</td>");
                tr.append("<td>" + json[i].PT_SOHV + "</td>");
                var _td = '<td>' +
                          ' <a href="javascript:void()"  class="deletePT_AUTO" id="ptAUTO_' + i + '"><img src="@Url.Content("~/fonts/grid-delete-icon1.gif")" title="Xóa phương tiện"  />'
                            + '</a> <input type="text" class="classPT_AUTO" style="display:none" value="' + json[i].ID + '" id="inputAUTO_' + i + '" />' +
                          '</td>';
                tr.append(_td);

                $('#tbodyidAuto').append(tr);
            }
        }
    });
</script>
